<template>
  <el-checkbox v-model="checked" :size="size" class="op-btn" @change="$emit('enable', $event)" />
  <DialogButton v-if="checked" :label="label">
    <slot></slot>
  </DialogButton>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import DialogButton from './DialogButton.vue';

  defineProps<{
    size?: string;
    label: string;
  }>();

  defineEmits(['enable']);

  const checked = ref(false);
</script>

<script lang="ts">
  // 声明额外的选项
  // noinspection JSUnusedGlobalSymbols
  export default {
    inheritAttrs: false
  };
</script>

<style scoped>
  .op-btn {
    margin-right: 10px;
  }
</style>
